<template>
	<view class="all-main">
		<view class="main">
			<!-- 微信 -->
			<view class="items">
				<view class="titles">
					<u-icon name="/static/icons/rate_3.png" size="20"></u-icon>
					<text>微信</text>
				</view>
				<view class="list">
					<view class="item">
						<view class="left">
							<view class="title">
								<text>微信费率</text>
							</view>
							<view class="msg">
								<text>0.25~0.6(%)</text>
							</view>
						</view>
						<view class="right">
							<view class="input">
								<input type="number" placeholder="微信费率" v-model="merchant.rateWx">
							</view>
							<view class="unit">
								<text>%</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 支付宝 -->
			<view class="items">
				<view class="titles">
					<u-icon name="/static/icons/rate_4.png" size="20"></u-icon>
					<text>支付宝</text>
				</view>
				<view class="list">
					<view class="item">
						<view class="left">
							<view class="title">
								<text>支付宝费率</text>
							</view>
							<view class="msg">
								<text>0.25~0.6(%)</text>
							</view>
						</view>
						<view class="right">
							<view class="input">
								<input type="number" placeholder="支付宝费率" v-model="merchant.rateZfb">
							</view>
							<view class="unit">
								<text>%</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 银联扫码 -->
			<view class="items">
				<view class="titles">
					<u-icon name="/static/icons/rate_6.png" size="20"></u-icon>
					<text>银联扫码</text>
				</view>
				<view class="list">
					<view class="item">
						<view class="left">
							<view class="title">
								<text>借记卡≤1000</text>
							</view>
							<view class="msg">
								<text>0.25~0.6(%)</text>
							</view>
						</view>
						<view class="right">
							<view class="input">
								<input type="number" placeholder="借记卡≤1000" v-model="merchant.rateYlCap0">
							</view>
							<view class="unit">
								<text>%</text>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="left">
							<view class="title">
								<text>借记卡＞1000</text>
							</view>
							<view class="msg">
								<text>0.53~0.6(%)</text>
							</view>
						</view>
						<view class="right">
							<view class="input">
								<input type="number" placeholder="借记卡≤1000" v-model="merchant.rateYlCap1">
							</view>
							<view class="unit">
								<text>%</text>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="left">
							<view class="title">
								<text>贷记卡≤1000</text>
							</view>
							<view class="msg">
								<text>0.25~0.6(%)</text>
							</view>
						</view>
						<view class="right">
							<view class="input">
								<input type="number" placeholder="借记卡≤1000" v-model="merchant.rateYlRat0">
							</view>
							<view class="unit">
								<text>%</text>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="left">
							<view class="title">
								<text>贷记卡＞1000</text>
							</view>
							<view class="msg">
								<text>0.53~0.6(%)</text>
							</view>
						</view>
						<view class="right">
							<view class="input">
								<input type="number" placeholder="借记卡≤1000" v-model="merchant.rateYlRat1">
							</view>
							<view class="unit">
								<text>%</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 银联刷卡 -->
			<view class="items">
				<view class="titles">
					<u-icon name="/static/icons/rate_2.png" size="20"></u-icon>
					<text>银联扫码</text>
				</view>
				<view class="list">
					<view class="item">
						<view class="left">
							<view class="title">
								<text>云闪付结算费率</text>
							</view>
							<view class="msg">
								<text>0.25~0.6(%)</text>
							</view>
						</view>
						<view class="right">
							<view class="input">
								<input type="number" placeholder="云闪付结算费率" v-model="merchant.ratePosS">
							</view>
							<view class="unit">
								<text>%</text>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="left">
							<view class="title">
								<text>借记卡结算费率</text>
							</view>
							<view class="msg">
								<text>0.52~1.25(%)</text>
							</view>
						</view>
						<view class="right">
							<view class="input">
								<input type="number" placeholder="借记卡结算费率" v-model="merchant.ratePosJb" @input="ratePosJbC">
							</view>
							<view class="unit">
								<text>%</text>
							</view>
							<view v-if="discountsRate.ratePosJy.is_set == 2" class="fengding">
								<view class="discount">
									<text class="msg">{{discountsRate.ratePosJy.msg}}</text>
									<text class="vals">{{merchant.ratePosJy}}</text>
								</view>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="left">
							<view class="title">
								<text>借记卡消费封顶值</text>
							</view>
							<view class="msg">
								<text>20.00~100.00(元)</text>
							</view>
						</view>
						<view class="right">
							<view class="input">
								<input type="number" placeholder="借记卡消费封顶值" v-model="merchant.moneyPosJb">
							</view>
							<view class="unit">
								<text>元</text>
							</view>
							<view class="fengding">
								<u-radio-group @change="topCap" v-model="merchant.moneyPosType" placement="row">
									<u-radio activeColor="red" :name="1">封顶</u-radio>
									<u-radio activeColor="red" :name="2">不封顶</u-radio>
								</u-radio-group>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="left">
							<view class="title">
								<text>贷记卡结算费率</text>
							</view>
							<view class="msg">
								<text>0.53~1.25(%)</text>
							</view>
						</view>
						<view class="right">
							<view class="input">
								<input type="number" placeholder="贷记卡结算费率" v-model="merchant.ratePosDb">
							</view>
							<view class="unit">
								<text>%</text>
							</view>
							<view v-if="discountsRate.ratePosDy.is_set == 2" class="fengding">
								<view class="discount">
									<text class="msg">{{discountsRate.ratePosDy.msg}}</text>
									<text class="vals">{{merchant.ratePosDy}}</text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 结算周期 -->
			<view class="items">
				<view class="option">
					<view class="left">
						<text>结算周期</text>
					</view>
					<view class="right" @click="stlTypeShow = true">
						<text>{{merchant.stlTypeText}}</text>
						<u-icon name="arrow-right" size="15"></u-icon>
					</view>
				</view>
				<view class="list">
					<view v-if="merchant.stlType == 2" class="item">
						<view class="left">
							<view class="title">
								<text>D1提现费率</text>
							</view>
							<view class="msg">
								<text>0~0.03(%)</text>
							</view>
						</view>
						<view class="right">
							<view class="input">
								<input type="number" placeholder="D1提现费率" v-model="merchant.rateTx">
							</view>
							<view class="unit">
								<text>%</text>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="left">
							<view class="title">
								<text>D0提现费率</text>
							</view>
							<view class="msg">
								<text>0.02~0.03(%)</text>
							</view>
						</view>
						<view class="right">
							<view class="input">
								<input type="number" placeholder="D0提现费率" v-model="merchant.rateD0">
							</view>
							<view class="unit">
								<text>%</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="occupy_position"></view>
			<view class="bottom-btn">
				<view class="btn-left" @click="saveData(2)">
					<text>暂存</text>
				</view>
				<view class="btn-right" @click="saveData(1)">
					<text>下一步</text>
				</view>
			</view>
			<!-- 插件 -->
			<u-picker :show="stlTypeShow" :columns="stlTypeList" keyName="label" :closeOnClickOverlay="true"
				@confirm="stlTypeConfirm" @close="stlTypeShow = false" @cancel="stlTypeShow = false"></u-picker>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				stlTypeShow: false,
				stlTypeList: [],
				discountsRate: {
					"ratePosJy": {
						"is_set": 1,
						"setValue": "",
						"msg": "",
					},
					"ratePosDy": {
						"is_set": 1,
						"setValue": "",
						"msg": ""
					},
					"moneyPosJy": {
						"is_set": 1,
						"setValue": "",
						"msg": ""
					}
				},
				merchant: {
					id: '',
					pageSize: 3,
					rateWx: '0.25', // 微信借记卡费率
					stlType: '2', // 结算类型：1：T1 2： D1
					stlTypeText: 'D+1', // 结算类型名称
					rateTx: '0', // 提现手续费D1附加手续费
					rateWxDj: '0.25', // 微信贷记卡费率
					rateZfb: '0.25', // 支付宝扣率%
					rateYlCap0: '0.25', // 银联扫码借记卡扣率小于1000费率 %
					rateYlCap1: '0.53', // 银联扫码借记卡扣率大于1000费率 %
					rateYlRat0: '0.25', // 银联扫码贷记卡扣率小于1000费率 %
					rateYlRat1: '0.53', // 银联扫码贷记卡扣率大于1000费率 %
					ratePosJy: '0.52', // 借记卡优惠类结算费率（%）
					ratePosJb: '0.52', // 借记卡标准类结算费率（%）
					ratePosDy: '0.53', // 贷记卡优惠类结算费率（%）
					ratePosDb: '0.53', // 贷记卡标准类结算费率（%）
					moneyPosType: 1, // 是否封顶：
					moneyPosJy: '20', // 借记卡优惠类消费封顶值
					moneyPosJb: '20', // 借记卡标准类消费封顶值
					ratePosM: '0.25', // 免签免密结算费率（%）
					ratePosS: '0.25', // 刷卡闪付结算费率（%）
					ylJFdDef: '20', // 银联扫码借记卡(≤1000)封顶值
					ylJFd2Def: '20', // 银联扫码借记卡(>1000)封顶值
					rateD0: '0.02', // D0附加手续费（%）
				}
			}
		},
		onLoad(e) {
			this.merchant.id = e.id
			this.getDiscountsRate()
			this.getStlType()
		},
		methods: {
			// 获取优惠费率
			async getDiscountsRate() {
				uni.showLoading({
					title: '加载中'
				});
				const {
					data: res
				} = await this.$myHttp({
					url: 'v1/getDiscountsRate',
					data: {
						id: this.merchant.id
					}
				});
				uni.hideLoading()
				if (res.code == 200) {
					this.discountsRate = res.data
					this.getMerchantEntry()
				}
			},
			// 获取商户进件信息
			async getMerchantEntry() {
				uni.showLoading({
					title: '加载中'
				});
				const {
					data: res
				} = await this.$myHttp({
					url: 'v1/getMerchantEntry',
					data: {
						id: this.merchant.id
					}
				});
				uni.hideLoading()
				if (res.code == 200) {
					this.merchant = res.data
					if (this.merchant.rateWx == null || this.merchant.rateWxDj == null) {
						this.getPolicyDetail()
						this.merchant.pageSize = 4
					}
				}
			},
			// 产品政策详情
			async getPolicyDetail() {
				uni.showLoading({
					title: '加载中'
				});
				const {
					data: res
				} = await this.$myHttp({
					url: 'v1/getPolicyDetail',
					data: {
						type: this.merchant.policy_id
					}
				});
				uni.hideLoading()
				if (res.code == 200) {
					this.merchant.rateWx = res.data.rateWx
					this.merchant.stlType = res.data.stlType
					this.merchant.stlTypeText = res.data.stlTypeText
					this.merchant.rateTx = res.data.rateTx
					this.merchant.rateWxDj = res.data.rateWxDj
					this.merchant.rateZfb = res.data.rateZfb
					this.merchant.rateYlCap0 = res.data.rateYlCap0
					this.merchant.rateYlCap1 = res.data.rateYlCap1
					this.merchant.rateYlRat0 = res.data.rateYlRat0
					this.merchant.rateYlRat1 = res.data.rateYlRat1
					if (this.discountsRate.ratePosJy.is_set == 2) {
						this.merchant.ratePosJy = (res.data.ratePosJy*100)/100 * this.discountsRate.ratePosJy.setValue
					} else {
						this.merchant.ratePosJy = res.data.ratePosJy
					}
					this.merchant.ratePosJb = res.data.ratePosJb
					if (this.discountsRate.ratePosDy.is_set == 2) {
						this.merchant.ratePosDy = (res.data.ratePosDy*100)/100 * this.discountsRate.ratePosDy.setValue
					} else {
						this.merchant.ratePosDy = res.data.ratePosDy
					}
					this.merchant.ratePosDb = res.data.ratePosDb
					this.merchant.moneyPosType = res.data.moneyPosType
					this.merchant.moneyPosJy = res.data.moneyPosJy
					this.merchant.moneyPosJb = res.data.moneyPosJb
					this.merchant.ratePosM = res.data.ratePosM
					this.merchant.ratePosS = res.data.ratePosS
					this.merchant.ylJFdDef = res.data.ylJFdDef
					this.merchant.ylJFd2Def = res.data.ylJFd2Def
					this.merchant.rateD0 = res.data.rateD0
				}
			},
			// 获取结算周期
			async getStlType() {
				uni.showLoading({
					title: '加载中'
				});
				const {
					data: res
				} = await this.$myHttp({
					url: 'v1/getStlType'
				});
				uni.hideLoading()
				if (res.code == 200) {
					this.stlTypeList = [res.data]
				}
			},
			// 选择封顶
			topCap(e) {
				if (e == 2) {
					this.merchant.moneyPosJy = ''
					this.merchant.moneyPosJb = ''
				} else {
					this.merchant.moneyPosJy = '0.25'
					this.merchant.moneyPosJb = '0.25'
				}
			},
			// 选择结算周期
			stlTypeConfirm(e) {
				this.merchant.stlType = e.value[0].id
				this.merchant.stlTypeText = e.value[0].label
				this.stlTypeShow = false
			},
			// 借记卡标准类结算费率
			ratePosJbC() {
				this.merchant.ratePosJy = this.merchant.ratePosJb * this.discountsRate.ratePosJy.setValue
			},
			// 保存数据
			saveData(type) {
				var _this = this
				var msg = ''
				this.merchant.saveType = type
				if (this.merchant.rateWx == null || this.merchant.rateWx == '') {
					uni.showToast({
						title: '请输入微信费率',
						icon: 'none',
						duration: 3000
					})
					return false
				} else {
					if (this.merchant.rateWx * 100 < 25 || this.merchant.rateWx * 100 > 60) {
						uni.showToast({
							title: '微信费率超出限制',
							icon: 'none',
							duration: 3000
						})
						return false
					}
				}
				if (this.merchant.rateZfb == null || this.merchant.rateZfb == '') {
					uni.showToast({
						title: '请输入支付宝费率',
						icon: 'none',
						duration: 3000
					})
					return false
				} else {
					if (this.merchant.rateZfb * 100 < 25 || this.merchant.rateZfb * 100 > 60) {
						uni.showToast({
							title: '支付宝费率超出限制',
							icon: 'none',
							duration: 3000
						})
						return false
					}
				}
				if (this.merchant.rateYlCap0 == null || this.merchant.rateYlCap0 == '') {
					uni.showToast({
						title: '请输入借记卡≤1000费率',
						icon: 'none',
						duration: 3000
					})
					return false
				} else {
					if (this.merchant.rateYlCap0 * 100 < 25 || this.merchant.rateYlCap0 * 100 > 60) {
						uni.showToast({
							title: '借记卡≤1000费率超出限制',
							icon: 'none',
							duration: 3000
						})
						return false
					}
				}
				if (this.merchant.rateYlCap1 == null || this.merchant.rateYlCap1 == '') {
					uni.showToast({
						title: '请输入借记卡＞1000费率',
						icon: 'none',
						duration: 3000
					})
					return false
				} else {
					if (this.merchant.rateYlCap1 * 100 < 53 || this.merchant.rateYlCap1 * 100 > 60) {
						uni.showToast({
							title: '借记卡＞1000费率超出限制',
							icon: 'none',
							duration: 3000
						})
						return false
					}
				}
				if (this.merchant.rateYlRat0 == null || this.merchant.rateYlRat0 == '') {
					uni.showToast({
						title: '请输入贷记卡≤1000费率',
						icon: 'none',
						duration: 3000
					})
					return false
				} else {
					if (this.merchant.rateYlRat0 * 100 < 25 || this.merchant.rateYlRat0 * 100 > 60) {
						uni.showToast({
							title: '贷记卡≤1000费率超出限制',
							icon: 'none',
							duration: 3000
						})
						return false
					}
				}
				if (this.merchant.rateYlRat1 == null || this.merchant.rateYlRat1 == '') {
					uni.showToast({
						title: '请输入贷记卡＞1000费率',
						icon: 'none',
						duration: 3000
					})
					return false
				} else {
					if (this.merchant.rateYlRat1 * 100 < 53 || this.merchant.rateYlRat1 * 100 > 60) {
						uni.showToast({
							title: '贷记卡＞1000费率超出限制',
							icon: 'none',
							duration: 3000
						})
						return false
					}
				}
				if (this.merchant.ratePosS == null || this.merchant.ratePosS == '') {
					uni.showToast({
						title: '请输入云闪付结算费率',
						icon: 'none',
						duration: 3000
					})
					return false
				} else {
					if (this.merchant.ratePosS * 100 < 25 || this.merchant.ratePosS * 100 > 60) {
						uni.showToast({
							title: '云闪付结算费率超出限制',
							icon: 'none',
							duration: 3000
						})
						return false
					}
				}
				if (this.merchant.ratePosJb == null || this.merchant.ratePosJb == '') {
					uni.showToast({
						title: '请输入借记卡结算费率',
						icon: 'none',
						duration: 3000
					})
					return false
				} else {
					if (this.merchant.ratePosJb * 100 < 52 || this.merchant.ratePosJb * 100 > 60) {
						uni.showToast({
							title: '借记卡结算费率超出限制',
							icon: 'none',
							duration: 3000
						})
						return false
					}
				}
				if (this.merchant.moneyPosType == 1) {
					if (this.merchant.moneyPosJb == null || this.merchant.moneyPosJb == '') {
						uni.showToast({
							title: '请输入借记卡消费封顶值',
							icon: 'none',
							duration: 3000
						})
						return false
					} else {
						if (this.merchant.moneyPosJb * 100 < 2000 || this.merchant.moneyPosJb * 100 > 10000) {
							uni.showToast({
								title: '借记卡消费封顶值超出限制',
								icon: 'none',
								duration: 3000
							})
							return false
						}
					}
				}
				if (this.merchant.ratePosDb == null || this.merchant.ratePosDb == '') {
					uni.showToast({
						title: '请输入贷记卡结算费率',
						icon: 'none',
						duration: 3000
					})
					return false
				} else {
					if (this.merchant.ratePosDb * 100 < 53 || this.merchant.ratePosDb * 100 > 60) {
						uni.showToast({
							title: '贷记卡结算费率超出限制',
							icon: 'none',
							duration: 3000
						})
						return false
					}
				}
				if (this.merchant.stlType == 2) {
					if (this.merchant.rateTx == null || this.merchant.rateTx == '') {
						uni.showToast({
							title: '请输入D1提现费率',
							icon: 'none',
							duration: 3000
						})
						return false
					} else {
						if (this.merchant.rateTx * 100 < 0 || this.merchant.rateTx * 100 > 2) {
							uni.showToast({
								title: 'D1提现费率超出限制',
								icon: 'none',
								duration: 3000
							})
							return false
						}
					}
				}
				if (this.merchant.rateD0 == null || this.merchant.rateD0 == '') {
					uni.showToast({
						title: '请输入D0结算费率',
						icon: 'none',
						duration: 3000
					})
					return false
				} else {
					if (this.merchant.rateD0 * 100 < 2 || this.merchant.rateD0 * 100 > 3) {
						uni.showToast({
							title: 'D0结算费率超出限制',
							icon: 'none',
							duration: 3000
						})
						return false
					}
				}

				if (type == 2) {
					msg = '是否要选择暂存当前信息？'
				} else {
					msg = '是否确认当前信息，进行下一步？'
				}
				uni.showModal({
					content: msg,
					success: (res) => {
						if (res.confirm) {
							_this.saveDataFun()
						}
					}
				})
			},
			// 提交数据
			async saveDataFun() {
				uni.showLoading({
					title: '加载中'
				});
				const {
					data: res
				} = await this.$myHttp({
					url: 'v1/merchantEntry',
					data: this.merchant,
				});
				uni.hideLoading()
				if (res.code == 200) {
					if (this.merchant.saveType == 2) {
						uni.reLaunch({
							url: '/pages/index/guotong/lists'
						});
					} else {
						uni.navigateTo({
							url: '/pages/index/guotong/sms_sign?id=' + this.merchant.id
						})
					}
				}
			},
		}
	}
</script>

<style lang="scss">
	.all-main {
		.main {
			padding: 30rpx;

			.items {
				margin-bottom: 30rpx;
				background-color: #fff;
				border-radius: 16rpx;
				padding: 0 30rpx;

				.titles {
					padding-top: 30rpx;
					display: flex;
					align-items: center;
					font-weight: bold;

					text {
						padding-left: 10rpx;
					}
				}

				.option {
					padding: 30rpx 0;
					display: flex;
					justify-content: space-between;
					align-items: center;
					border-bottom: 1px solid #f4f4f5;

					.right {
						display: flex;

						text {
							padding-right: 10rpx;
						}
					}
				}

				.list {

					.item {
						padding: 30rpx 0;
						display: flex;
						justify-content: space-between;
						align-items: center;
						border-bottom: 1px solid #f4f4f5;

						.left {
							width: 50%;

							.msg {
								font-size: 24rpx;
								color: #909399;
							}
						}

						.right {
							display: flex;
							align-items: center;
							flex-wrap: wrap;
							justify-content: flex-end;

							.input {
								width: 200rpx;

								input {
									background-color: #E4E7ED;
									text-align: center;
									padding: 10rpx;
									border-radius: 10rpx;
									font-size: 28rpx;
								}
							}

							.unit {
								margin-left: 20rpx;
							}

							.fengding {
								padding-top: 30rpx;
								
								.discount {
									font-size: 24rpx;
									border: 1px solid #fa3534;
									
									text {
										padding: 4rpx 10rpx;
										display: inline-block;
									}
									
									.msg {
										background-color: #fa3534;
										color: #fff;
									}
									
									.vals {
										color: #fa3534;
									}
								}
							}
						}
					}
				}
			}

			.occupy_position {
				height: 110rpx;
			}

			.bottom-btn {
				position: fixed;
				left: 0;
				right: 0;
				bottom: 0;
				padding: 30rpx;
				background-color: #ffffff;
				display: flex;
				justify-content: space-between;

				.btn-left {
					width: 48%;
					height: 80rpx;
					display: flex;
					justify-content: center;
					align-items: center;
					background-color: #f8ece3;
					color: #f2873a;
					border-radius: 14rpx;
				}

				.btn-right {
					width: 48%;
					height: 80rpx;
					display: flex;
					justify-content: center;
					align-items: center;
					background-color: #f2873a;
					color: #ffffff;
					border-radius: 14rpx;
				}
			}
		}
	}
</style>